<template>
  <div class="tefectTracking">
    <div class="searchDiv">
      <Form :model="searchItem" :label-width="80">
        <Row :gutter="10">
          <Col span="6">
            <FormItem label="问题编号">
              <Input v-model="searchItem.num" placeholder="请输入"></Input>
            </FormItem>
          </Col>
          <Col span="6">
            <FormItem label="功能位置">
              <Input v-model="searchItem.location" placeholder="请输入"></Input>
            </FormItem>
          </Col>
          <Col span="6">
            <FormItem label="进展状态" >
              <Select v-model="searchItem.progressStatus" label-in-value clearable filterable>
                <Option v-for="(item, index) in progressList" :value="item.displayName" :key="index">{{item.displayName}}</Option>
              </Select>
            </FormItem>
          </Col>
          <Col span="6">
            <FormItem label="负责人">
              <Select v-model="searchItem.principal" label-in-value clearable filterable>
                      <Option v-for="(item, index) in peopleList" :value="item.trueName" :key="index">{{item.trueName}}</Option>
                </Select>
            </FormItem>
          </Col>
           <Col span="6">
            <FormItem label="跟踪人">
              <Select v-model="searchItem.follower" label-in-value clearable filterable>
                      <Option v-for="(item, index) in peopleList" :value="item.trueName" :key="index">{{item.trueName}}</Option>
                </Select>
            </FormItem>
          </Col>
          <Col span="6">
            <FormItem label="类别">
              <Select v-model="searchItem.catory" clearable filterable>
                 <Option v-for="(item, index) in typeList" :value="item.displayName" :key="index">{{item.displayName}}</Option>
              </Select>
            </FormItem>
          </Col>
          <Col span="6">
            <FormItem label="重要度">
              <Select v-model="searchItem.importance" clearable filterable>
                <Option v-for="(item, index) in zhongyaoduList" :value="item.displayName" :key="index">{{item.displayName}}</Option>
              </Select>
            </FormItem>
          </Col>
          <Col span="6">
            <FormItem label="问题类型">
              <Select v-model="searchItem.issueCatory" clearable filterable>
                <Option v-for="(item, index) in wentiTypeList" :value="item.displayName" :key="index">{{item.displayName}}</Option>
              </Select>
            </FormItem>
          </Col>
          <Col span="12">
            <Button type="primary" @click="searchItem.pageNo=1;search()" class="marRight">查询</Button>
            <Button type="success" class="marRight" @click="add">新增问题记录</Button>
            <Button type="primary" @click="downBtn">导出Excel</Button>
          </Col>
        </Row>
      </Form>
    </div>
    <Table :loading="loading" border :columns="columns" :data="tableData"></Table>
    <Page show-total :total="total" show-elevator :current="searchItem.pageNo" :page-size='searchItem.pageSize' @on-change='pageChange'  style="margin:20px auto;text-align:center"/>

    <!-- 新增弹窗开始 -->
    <Modal :mask-closable="false" v-model="modal1" :title="title1" width="1000" @on-ok="ok">
      <div class="baseTitle">基本信息</div>
      <Form :label-width="100">
        <Row :gutter="10" class="xzjz">
            <Col span="8">
              <FormItem label="问题编号：">
                <Input v-model="formItem.num" :maxlength="20" placeholder="请输入"></Input>
              </FormItem>
            </Col>
            <Col span="8">
              <FormItem label="功能位置：">
                <Input v-model="formItem.location" :maxlength="20" placeholder="请输入"></Input>
              </FormItem>
            </Col>
            <Col span="8">
              <FormItem label="问题：">
                <Input v-model="formItem.issue" :maxlength="20" placeholder="请输入"></Input>
              </FormItem>
            </Col>
            <Col span="8">
              <FormItem :model="formItem" label="进展状态：">
                <Select v-model="formItem.progressStatus">
                  <Option v-for="(item, index) in progressList" :value="item.displayName" :key="index">{{item.displayName}}</Option>
                </Select>
              </FormItem>
            </Col>
            <Col span="8">
              <FormItem label="来源或跟踪项：">
                <Select v-model="formItem.source">
                    <Option v-for="(item, index) in lauyuanList" :value="item.displayName" :key="index">{{item.displayName}}</Option>
                </Select>
              </FormItem>
            </Col>
            <Col span="8">
              <FormItem label="类别：">
                <Select v-model="formItem.catory">
                  <Option v-for="(item, index) in typeList" :value="item.displayName" :key="index">{{item.displayName}}</Option>
                </Select>
              </FormItem>
            </Col>
            <Col span="8">
              <FormItem label="计划完成时间：">
                <DatePicker
                  type="datetime"
                  format="yyyy-MM-dd HH:mm:ss"
                  v-model="formItem.planCompleteTime"
                  placeholder="请选择"
                  style="width: 100%"
                  @on-change="handleCHangeCompleteTime"
                ></DatePicker>
              </FormItem>
            </Col>
            <Col span="8">
              <FormItem label="问题类型：">
                <Select v-model="formItem.issueCatory">
                    <Option v-for="(item, index) in wentiTypeList" :value="item.displayName" :key="index">{{item.displayName}}</Option>
                </Select>
              </FormItem>
            </Col>
            <Col span="8">
              <FormItem label="重要度：">
                <Select v-model="formItem.importance">
                  <Option v-for="(item, index) in zhongyaoduList" :value="item.displayName" :key="index">{{item.displayName}}</Option>
                </Select>
              </FormItem>
            </Col>
            <Col span="8">
              <FormItem label="负责人：">
                <Select @on-change="principal" multiple  v-model="selectPeopleList">
                    <Option v-for="(item, index) in peopleList" :value="index" :key="index">{{item.trueName}}</Option>
                </Select>
              </FormItem>
            </Col>
            <Col span="8">
              <FormItem label="跟踪人：">
                <Select @on-change="follower" v-model="genZongrenList" multiple>
                    <Option v-for="(item, index) in peopleList" :value="index"  :key="index">{{item.trueName}}</Option>
                </Select>
              </FormItem>
            </Col>
            <Col span="8">
              <FormItem label="完成百分比：">
                <InputNumber style="width:100%" :max="100" :min="0" :formatter="value => `${value}%`"
            :parser="value => value.replace('%', '')" @input="numchange" :value="formItem.completePercent" v-model="formItem.completePercent"></InputNumber>
              </FormItem>
            </Col>
        </Row>
        <div class="baseTitle">问题描述</div>
        <Row :gutter="10" class="xzjz">
            <Col span="24">
                <FormItem label="问题描述：">
                  <Input v-model="formItem.description" :maxlength="200" type="textarea" placeholder="请输入"></Input>
                </FormItem>
            </Col>
        </Row>
        <div class="baseTitle">原因分析</div>
        <Row :gutter="10" class="xzjz">
            <Col span="24">
                <FormItem label="原因分析：">
                <Input v-model="formItem.reasonAnalyze" :maxlength="200" type="textarea" placeholder="请输入"></Input>
                  </FormItem>
            </Col>
        </Row>
        <div class="baseTitle">目标计划</div>
        <Row :gutter="10" class="xzjz">
            <Col span="6">
              <FormItem label="计划时间：">
                <DatePicker
                  type="datetime"
                  v-model="jishuList.planTime"
                  placeholder="计划时间"
                  @on-change="handleChangeRecordTime"
                  style="width: 100%"
                ></DatePicker>
              </FormItem>
            </Col>
            <Col span="8">
                <FormItem label="工作内容：">
                <Input v-model="jishuList.workContent" :maxlength="50" type="text" placeholder="请输入"></Input>
                </FormItem>
            </Col>
            <Col span="6">
                <FormItem label="完成百分比：">
                <InputNumber style="width:100%"  @input="numchange2" :max="100" :min="0" :formatter="value => `${value}%`"
            :parser="value => value.replace('%', '')" v-model="jishuList.completePercent" :value="jishuList.completePercent"></InputNumber>
                </FormItem>
            </Col>
            <Col span="2">
                <FormItem label="">
                <Button @click="addJh">添加</Button>
                </FormItem>
            </Col>
        </Row>
        <Table border :columns="columns2" :data="tableData2" style="margin-bottom:10px"></Table>
      </Form>
      <div class="baseTitle">最新进展</div>
      <Form :label-width="100">
        <Row :gutter="10" class="xzjz" style="margin-top:10px;">
            <Col span="12">
              <FormItem label="进展：">
                <Input v-model="genzongList.content" :maxlength="200" placeholder="请输入"></Input>
              </FormItem>
            </Col>
            <Col span="12">
                <Upload
                  :show-upload-list='false'
                  :headers='fileheader'
                  :on-success='fileSuccess'
                  style="float:left;margin-right:15px;"
                  :action="apihost+'/admin-api/admins/upload/uploadFile'">
                    <Button icon="ios-cloud-upload-outline">上传文件</Button>
                </Upload>
                <Button @click="addgz">添加</Button>
            </Col>
             <Col span="24" style="overflow:hidden;margin-bottom:10px;" v-if="genzongList.attachUrl!=''" >
                      <span style="">{{genzongList.attachUrl.substring(genzongList.attachUrl.lastIndexOf('/')+1)}}</span>
                      <Button size="small" style="margin-left:30px;margin-right:10px;"  @click="xiazai(genzongList.attachUrl)" type="primary">下载文件</Button>
                      <Button size="small"  @click="genzongList.attachUrl=''" type="error">删除</Button>
                  </Col>
        </Row>
      </Form>
      <Table border :columns="columns3" :data="tableData3"></Table>
      <Form :label-width="100">
        <Row :gutter="10" class="xzjz" style="margin-top:10px;">
            <Col span="8" style="text-align:center">
              <Button type="primary" size="large" :loading="btnClick" @click="ok"> 保存 </Button>
            </Col>
            <Col span="8" style="text-align:center">
              <Button size="large" @click="openEmail"> 发送邮件 </Button>
            </Col>
            <Col span="8" style="text-align:center">
                <Button size="large" @click="cancle"> 取消 </Button>
            </Col>
        </Row>
      </Form>
      <div slot="footer">
          <!-- <Button type="error" size="large" long :loading="modal_loading" @click="del">Delete</Button> -->
      </div>
    </Modal>
    <Modal :mask-closable="false" v-model="modal2" width="500" class-name="vertical-center-modal" @on-ok="sendEmaildiv">
        <Form :model="searchItem" :label-width="80">
        <Row :gutter="10">
          <Col span="20">
            <FormItem label="邮件发送人">
              <Select v-model="EmailPeople" multiple>
                      <Option v-for="(item, index) in peopleList" :value="item.trueName" :key="index">{{item.trueName}}</Option>
                </Select>
            </FormItem>
          </Col>
        </Row>
      </Form>
    </Modal>
    <Modal :mask-closable="false" v-model="delmodal1" width="360" class-name="vertical-center-modal" @on-ok="remove(delIndex)">
        <p slot="header" style="color:#f60;text-align:center">
            <Icon type="ios-information-circle"></Icon>
            <span>确认删除</span>
        </p>

        <div style="text-align:center">
            <p>确认删除此数据么？</p>
        </div>
    </Modal>
    <Modal :mask-closable="false" v-model="delmodal2" width="360" class-name="vertical-center-modal" @on-ok="remove2(delIndex2)">
        <p slot="header" style="color:#f60;text-align:center">
            <Icon type="ios-information-circle"></Icon>
            <span>确认删除</span>
        </p>

        <div style="text-align:center">
            <p>确认删除此数据么？</p>
        </div>
    </Modal>
    <Modal :mask-closable="false" v-model="delmodal3" width="360" class-name="vertical-center-modal" @on-ok="remove3(delIndex3)">
        <p slot="header" style="color:#f60;text-align:center">
            <Icon type="ios-information-circle"></Icon>
            <span>确认删除</span>
        </p>

        <div style="text-align:center">
            <p>确认删除此数据么？</p>
        </div>
    </Modal>
    <!-- 新增弹窗结束 -->
  </div>
</template>

<script>

import {
  addDefect,
  searchDefect,
  removeDefect,
  updateDefect,
  addProgress,
  upfile,
  seachWenti,
  seachJiHua,
  sendEmail,
  downExcel
} from '@/api/problem'
import { getToken } from '@/libs/util'
import axios from '@/libs/api.request'
import {
  getSelectOption,
  getAllPeople
} from '@/api/select'
export default {
  data () {
    return {
      btnClick:false,
      loading:true,
      modal1:false,
      modal2:false,
      EmailPeople:[],
      delmodal1: false,
      delIndex1: 0,
      delmodal2: false,
      delIndex2: 0,
      delmodal3: false,
      delIndex3: 0,
      total: 0,
      newfile:'',//新文件
      peopleList:[],
      title1: '新增问题记录',
      searchItem: {
        pageNo: 1,
        pageSize: 10
      },
      formItem: {
        num:'',
        location: '',
        issue: '',
        progressStatus: '',
        source: '',
        catory: '',
        importance: '',
        issueCatory: '',
        principalIds:'',
        principalNames: '',
        followerIds:'',
        followerNames: '',
        completePercent: 0,
        description: '',
        reasonAnalyze: '',
      },
      columns: [
        {
          type: 'index',
          width: 60,
          title: '序号',
          align: 'center'
        },
        {
          title: '问题编号',
          key: 'num'
        },
        {
          title: '功能位置',
          key: 'location'
        },
        {
          title: '问题',
          key: 'issue'
        },
        {
          title: '进展状态',
          key: 'progressStatus'
        },
        {
          title: '负责人',
          key: 'principalNames'
        },
        {
          title: '跟踪人',
          key: 'followerNames'
        },
        {
          title: '类别',
          key: 'catory'
        },
        {
          title: '重要度',
          key: 'importance'
        },
        {
          title: '问题类型',
          key: 'issueCatory'
        },
        {
          title: '操作',
          key: 'action',
          width: 150,
          align: 'center',
          render: (h, params) => {
            return h('div', [
              h(
                'Button',
                {
                  props: {
                    type: 'primary',
                    size: 'small'
                  },
                  style: {
                    marginRight: '5px'
                  },
                  on: {
                    click: () => {
                      this.detail(params)
                    }
                  }
                },
                '详情'
              ),
              h(
                'Button',
                {
                  props: {
                    type: 'error',
                    size: 'small'
                  },
                  on: {
                    click: () => {
                      this.openDel1(params.row.id)
                    }
                  }
                },
                '删除'
              )
            ])
          }
        }
      ],
      tableData: [
        {
          wtbh: '34534534',
          gnwz: '功能位置',
          wtms: '问题描述',
          jzzt: '进展状态',
          fzr: '李小明',
          gzr: '张小小',
          leibie: '类别',
          zyd: '重要度',
          wtlx: '问题类型'
        },
        {
          wtbh: '34534534',
          gnwz: '功能位置',
          wtms: '问题描述',
          jzzt: '进展状态',
          fzr: '李小明',
          gzr: '张小小',
          leibie: '类别',
          zyd: '重要度',
          wtlx: '问题类型'
        }
      ],
      columns2: [
        {
          type: 'index',
          width: 60,
          title: '序号',
          align: 'center'
        },
        {
          title: '计划时间',
          key: 'planTime',
          width: 180
        },
        {
          title: '工作内容',
          key: 'workContent',
        },
        {
          title: '完成百分比',
          key: 'completePercent',
          width: 100
        },
        {
          title: '记录人',
          key: 'recordName',
          width: 80
        },
        {
          title: '记录时间',
          key: 'recordTime',
          width: 180
        },
        {
          title: '操作',
          key: 'action',
          width: 100,
          align: 'center',
          render: (h, params) => {
            return h('div', [
              h(
                'Button',
                {
                  props: {
                    type: 'error',
                    size: 'small'
                  },
                  on: {
                    click: () => {
                      this.openDel2(params.index)
                    }
                  }
                },
                '删除'
              )
            ])
          }
        }
      ],
      tableData2: [
        // {
        //   workContent: '进展内容示例进展内容示例进展内容示例进展内容示例进展内容示例',
        //   recordName: '李小明',
        //   planTime:'2019-09-01 12：22：09',
        //   recordTime: '2019-09-01 12：22：09',
        //   completePercent:'80%'
        // },
        // {
        //   workContent: '进展内容示例进展内容示例进展内容示例进展内容示例进展内容示例',
        //   recordName: '李小明',
        //   planTime:'2019-09-01 12：22：09',
        //   recordTime: '2019-09-01 12：22：09',
        //   completePercent:'80%'
        // },
      ],
      columns3: [
        {
          type: 'index',
          width: 60,
          title: '序号',
          align: 'center'
        },
        {
          title: '进展',
          key: 'content',
          tooltip:true
        },
        {
          title: '记录人',
          key: 'recordName',
          width: 80
        },
        {
          title: '记录时间',
          key: 'recordTime',
          width: 180
        },
        {
          title: '操作',
          key: 'action',
          width: 160,
          align: 'center',
          render: (h, params) => {
            if(params.row.attachUrl!=''){
              return h('div', [
              h(
                'Button',
                {
                  props: {
                    type: 'primary',
                    size: 'small'
                  },
                  style: {
                    marginRight: '5px'
                  },
                  on: {
                    click: () => {
                      this.down(params.row.attachUrl)
                    }
                  }
                },
                '下载附件'
              ),
              h(
                'Button',
                {
                  props: {
                    type: 'error',
                    size: 'small'
                  },
                  on: {
                    click: () => {
                      this.openDel3(params.index)
                    }
                  }
                },
                '删除'
              )
            ])
            }else{
              return h('div', [
              h(
                'Button',
                {
                  props: {
                    type: 'error',
                    size: 'small'
                  },
                  on: {
                    click: () => {
                      this.openDel3(params.index)
                    }
                  }
                },
                '删除'
              )
            ])
            }
          }
        }
      ],
      tableData3: [],
      progressList:[],
      typeList:[],
      zhongyaoduList:[],
      wentiTypeList:[],
      lauyuanList:[],
      selectPeopleList:[],
      genZongrenList:[],
      jishuList:{
        recordId:'',
        recordName:'',
        recordTime:'',
        completePercent:0,
        workContent:'',
        planTime:'',
      },
      fileheader: {
        Authorization: 'Bearer ' + (getToken() ? getToken() : '')
      },
      genzongList:{
        content:'',
        attachUrl:'',
        recordId:'',
        recordName:'',
        recordTime:'',
      }
    }
  },
  methods: {
    downBtn(){
      downExcel(this.searchItem).then(res => {
          const blob = new Blob([res], {type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;'});

        const ie = navigator.userAgent.match(/MSIE\s([\d.]+)/),
            ie11 = navigator.userAgent.match(/Trident\/7.0/) && navigator.userAgent.match(/rv:11/),
            ieEDGE = navigator.userAgent.match(/Edge/g),
            ieVer = (ie ? ie[1] : (ie11 ? 11 : (ieEDGE ? 12 : -1)));
        console.log('ie:' + ie);
        console.log('ieVer:' + ieVer);
        if (ie && ieVer < 10) {
            this.message.error('No blobs on IE<10');
            return;
        }
        if (ieVer > -1) {
            window.navigator.msSaveBlob(blob, '问题跟踪.xlsx');
        } else {
            const url = window.URL.createObjectURL(blob);
            let link = document.createElement('a');
            link.setAttribute('href', url);
            link.setAttribute('download', '问题跟踪.xlsx');
            document.body.appendChild(link);
            link.click();
            document.body.removeChild(link);
        }



        // const blob = new Blob([res]);//处理文档流
        //   const fileName = '问题跟踪.xlsx';
        //   const elink = document.createElement('a');
        //   elink.download = fileName;
        //   elink.style.display = 'none';
        //   elink.href = URL.createObjectURL(blob);
        //   document.body.appendChild(elink);
        //   elink.click();
        //   URL.revokeObjectURL(elink.href); // 释放URL 对象
        //   document.body.removeChild(elink);
      })
    },
    numchange(event){
      if(event<1){
        this.formItem.completePercent=1
      }else if(event>100){
        this.formItem.completePercent=100;
      }
    },
    numchange2(event){
      if(event<1){
        this.jishuList.completePercent=1
      }else if(event>100){
        this.jishuList.completePercent=100;
      }
    },
     xiazai(url){
       window.open(url)
    },
    sendEmaildiv(){
      this.modal2 = false;
    },
    openEmail(){
      if(this.formItem.id==undefined){
        this.$Message.info('请先保存问题后再发送！')
        return;
      }
      let obj={
        adminIds:this.formItem.principalIds+','+this.formItem.followerIds,
        id:this.formItem.id
      };
      sendEmail(obj).then(res => {
        if (res.code == 0) {
          this.$Message.info('发送成功')
          this.modal1 = false;
        } else {
          this.$Message.info(res.message)
        }
      })


    },
    getLaiyuan(){
      getSelectOption(
        {
          code: 'source'
        }
      ).then(res => {
        this.lauyuanList = res.data;
      }).catch(err => {
        console.error('err>' + JSON.stringify(err))
      })
    },
    getWentiTypeList(){
      getSelectOption(
        {
          code: 'issueCatory'
        }
      ).then(res => {
        this.wentiTypeList = res.data
      }).catch(err => {
        console.error('err>' + JSON.stringify(err))
      })
    },
    getzhongYaoDu(){
      getSelectOption(
        {
          code: 'importance'
        }
      ).then(res => {
        this.zhongyaoduList = res.data
      }).catch(err => {
        console.error('err>' + JSON.stringify(err))
      })
    },
    getType(){
      getSelectOption(
        {
          code: 'catory'
        }
      ).then(res => {
        this.typeList = res.data
      }).catch(err => {
        console.error('err>' + JSON.stringify(err))
      })
    },
    getJinzhan(){
      getSelectOption(
        {
          code: 'progressStatus'
        }
      ).then(res => {
        this.progressList = res.data
      }).catch(err => {
        console.error('err>' + JSON.stringify(err))
      })
    },
    recordName(e){
      this.formItem.recordName=e.label;
      console.log(this.formItem.recordId)
      console.log(this.formItem.recordName)
    },
    principal(e){
      let nameArr = [];
      let idArr = [];
      for (let i = 0; i < this.selectPeopleList.length; i++) {
        nameArr.push(this.peopleList[this.selectPeopleList[i]].trueName);
        idArr.push(this.peopleList[this.selectPeopleList[i]].id);
      }
      this.formItem.principalIds = idArr.join(',')
      this.formItem.principalNames = nameArr.join(',')
      console.log(this.formItem.principalNames,this.formItem.principalIds,'转换后的数据')
    },
    follower(){
      let nameArr = [];
      let idArr = [];
      for (let i = 0; i < this.genZongrenList.length; i++) {
        nameArr.push(this.peopleList[this.genZongrenList[i]].trueName);
        idArr.push(this.peopleList[this.genZongrenList[i]].id);
      }
      this.formItem.followerIds = idArr.join(',')
      this.formItem.followerNames = nameArr.join(',')
      console.log(this.formItem.followerIds,this.formItem.followerNames,'转换后的数据')
    },
    //获取所有人员
    getAllPeople(){
      getAllPeople(
        null
      ).then(res => {
        this.peopleList = res.data;
        console.log(res.data,'人员列表');
      }).catch(err => {
        console.error('err>' + JSON.stringify(err))
      })
    },
    pageChange (e) {
      this.searchItem.pageNo = e
      console.log(this.searchItem.pageNo, '页码')
      this.search()
    },
    handleChangeRecordTime (e) {
      this.jishuList.planTime = e;
      console.log(this.jishuList.planTime)
    },
    handleCHangeCompleteTime (e) {
      this.formItem.planCompleteTime = e
    },
    openDel1 (index) {
      this.delmodal1 = true
      this.delIndex = index
      // this.remove(params.index);
    },
    openDel2 (index) {
      this.delmodal2 = true
      this.delIndex2 = index
    },
    openDel3 (index) {
      this.delmodal3 = true
      this.delIndex3 = index
    },
    remove (id) {
      let obj = {
        id: id
      }
      removeDefect(obj).then(res => {
        if (res.code == 0) {
          this.$Message.info('删除成功')
          this.searchItem.pageNo=1
          this.search()
        } else {
          this.$Message.info(res.message)
        }
      }).catch(err => {
        console.error('err>' + JSON.stringify(err))
        this.loading3 = false
      })
    },
    remove2 (index) {
      this.tableData2.splice(index, 1)
    },
    remove3 (index) {
      this.tableData3.splice(index, 1)
    },
    add () {
      this.title1 = '新增问题记录'
      this.modal1 = true;
      this.formItem={};
      this.tableData2=[];
      this.tableData3=[];
      this.selectPeopleList=[];
      this.genZongrenList=[];
    },
    getTime(t){
      if(t){
        var now = new Date(t);
        var year = now.getFullYear(); //得到年份
        var month = now.getMonth();//得到月份
        var date = now.getDate();//得到日期
        var day = now.getDay();//得到周几
        var hour = now.getHours();//得到小时
        var minu = now.getMinutes();//得到分钟
        var sec = now.getSeconds();//得到秒
        var MS = now.getMilliseconds();//获取毫秒
        var week;
        month = month + 1;
        if (month < 10) month = "0" + month;
        if (date < 10) date = "0" + date;
        if (hour < 10) hour = "0" + hour;
        if (minu < 10) minu = "0" + minu;
        if (sec < 10) sec = "0" + sec;
        var time = "";
        time = year + "-" + month + "-" + date  + " " + hour + ":" + minu + ":" + sec;
        console.log(time)
        return  time
      }else{
        var now = new Date();
        var year = now.getFullYear(); //得到年份
        var month = now.getMonth();//得到月份
        var date = now.getDate();//得到日期
        var day = now.getDay();//得到周几
        var hour = now.getHours();//得到小时
        var minu = now.getMinutes();//得到分钟
        var sec = now.getSeconds();//得到秒
        var MS = now.getMilliseconds();//获取毫秒
        var week;
        month = month + 1;
        if (month < 10) month = "0" + month;
        if (date < 10) date = "0" + date;
        if (hour < 10) hour = "0" + hour;
        if (minu < 10) minu = "0" + minu;
        if (sec < 10) sec = "0" + sec;
        var time = "";
        time = year + "-" + month + "-" + date  + " " + hour + ":" + minu + ":" + sec;
        console.log(time)
        return  time
      }
    },
    //添加计划
    addJh () {
      this.jishuList.recordTime = this.getTime();
      this.jishuList.recordName = localStorage.getItem('recordUserName');
      this.jishuList.recordId = localStorage.getItem('recordUserId');
      console.log(this.jishuList)
      this.tableData2.push(this.jishuList);
      this.jishuList = {
        recordId:'',
        recordName:'',
        recordTime:'',
        completePercent:0,
        workContent:'',
        planTime:'',
      }
    },
    //添加问题进展
    addgz () {
      if(this.genzongList.content==''){
        this.$Message.error('进展不能为空');
        return;
      }
      // if(this.genzongList.attachUrl==''){
      //   this.$Message.error('请上传附件');
      //   return;
      // }
      this.genzongList.recordTime = this.getTime();
      this.genzongList.recordName = localStorage.getItem('recordUserName');
      this.genzongList.recordId = localStorage.getItem('recordUserId');
      this.tableData3.push(this.genzongList);
      this.genzongList = {
        content:'',
        attachUrl:'',
        recordId:'',
        recordName:'',
        recordTime:'',
      }
    },
    fileSuccess (response, file, fileList) {
      console.log(response)
      if(response.code == 0 ){
        this.$Message.success('上传成功');
        this.genzongList.attachUrl = response.data
      }else{
        this.$Message.error(response.message);
      }
    },
    down(url){
      console.log(url)
      window.open(url)
    },
    detail (params) {
      this.title1 = '编辑问题记录'
      this.formItem = params.row
      this.modal1 = true;
      console.log(params.row.principalIds.split(','),'负责人')
      console.log(params.row.followerIds.split(','),'跟踪人')
      let pList = params.row.principalIds.split(',')
      let pList2 = params.row.followerIds.split(',')
      let arr = [];
      for(let a = 0;a<this.peopleList.length;a++){
        for(let b=0;b<pList.length;b++){
          if(pList[b] == this.peopleList[a].id){
            console.log(this.peopleList[a]);
            arr.push(a);
          }
        }
      }
      let arr2 = [];
      for(let c = 0;c<this.peopleList.length;c++){
        for(let d=0;d<pList2.length;d++){
          if(pList2[d] == this.peopleList[c].id){
            console.log(this.peopleList[c]);
            arr2.push(c);
          }
        }
      }
      console.log(arr,arr2);
      this.selectPeopleList = arr;
      this.genZongrenList = arr2;
      seachWenti({defectFollowerId:params.row.id}).then(res=>{
        console.log(res.data,'获取问题跟踪列表');
        if (res.code == 0) {
            if(res.data){
              this.tableData3 = res.data;
            }else{
              this.tableData3 = [];
            }
          } else {
            this.$Message.info(res.message)
          }
      })
      seachJiHua({defectFollowerId:params.row.id}).then(res=>{
        console.log(res.data,'获取计划列表');
        if (res.code == 0) {
            if(res.data){
              this.tableData2 = res.data;
            }else{
              this.tableData2 = [];
            }
          } else {
            this.$Message.info(res.message)
          }
      })
    },
    ok () {
      this.btnClick=true;
      let params=this.formItem;
      params.recordTime = this.getTime();
      params.recordName = localStorage.getItem('recordUserName');
      params.recordId = localStorage.getItem('recordUserId');

      for(var i=0;i<this.tableData2.length;i++){
        params["attachAddDtoList["+i+"].completePercent"]=this.tableData2[i].completePercent;
        params["attachAddDtoList["+i+"].planTime"]=this.tableData2[i].planTime;
        params["attachAddDtoList["+i+"].recordId"]=this.tableData2[i].recordId;
        params["attachAddDtoList["+i+"].recordName"]=this.tableData2[i].recordName;
        params["attachAddDtoList["+i+"].recordTime"]=this.tableData2[i].recordTime;
        params["attachAddDtoList["+i+"].workContent"]=this.tableData2[i].workContent;
        // params["attachAddDtoList["+i+"].defectFollowerId"]=this.tableData2[i].defectFollowerId;
        // params["attachAddDtoList["+i+"].workContent"]=this.tableData2[i].workContent;
        // params["attachAddDtoList["+i+"].workContent"]=this.tableData2[i].workContent;
      }
      for(var i=0;i<this.tableData3.length;i++){
        params["progressAddDtoList["+i+"].attachUrl"]=this.tableData3[i].attachUrl;
        params["progressAddDtoList["+i+"].content"]=this.tableData3[i].content;
        params["progressAddDtoList["+i+"].recordId"]=this.tableData3[i].recordId;
        params["progressAddDtoList["+i+"].recordName"]=this.tableData3[i].recordName;
        params["progressAddDtoList["+i+"].recordTime"]=this.tableData3[i].recordTime;
        // params["progressAddDtoList["+i+"].name"]=this.csList[i].name;
        // params["progressAddDtoList["+i+"].referenceValue"]=this.csList[i].referenceValue;
        // params["progressAddDtoList["+i+"].unit"]=this.csList[i].unit;
      }
      if (this.title1 == '新增问题记录') {
        addProgress(params).then((res) => {
          console.log('data：', params)
          console.log('add success： ', res)
          if (res.code == 0) {
            this.formItem.id=res.data.id;
            this.$Message.info('新增成功');
            this.search()
            this.btnClick=false;
          } else {
            this.$Message.info(res.message)
            this.btnClick=false
          }
        }).catch(err => {
          console.error('err>' + JSON.stringify(err))
          this.loading3 = false
        })
      } else {
        params.planCompleteTime = this.getTime(params.planCompleteTime)
        updateDefect(params).then(res => {
          console.log(res, params)
          if (res.code == 0) {
            this.$Message.info('修改成功');
            this.search()
            this.btnClick=false
          } else {
            this.$Message.info(res.message)
            this.btnClick=false
          }
        }).catch(err => {
          console.error('err>' + JSON.stringify(err))
        })
      }
    },
    cancle () {
      this.formItem = {};
      this.modal1 = false
    },
    search () {
      console.log(this.searchItem)
      searchDefect(this.searchItem).then(res => {
        console.log('get search:', res)

        if (res.code == 0) {
          this.tableData = res.data.list

          this.total = res.data.total
          this.loading=false
        } else {
          this.$Message.info(res.message)
        }
      }).catch(err => {
        console.log(err)
      })
    }
  },
  mounted () {
    this.getAllPeople();
    this.getJinzhan();
    this.getType();
    this.getLaiyuan();
    this.getzhongYaoDu();
    this.getWentiTypeList();
    this.search()
  },
  created(){
    if(this.$route.query.open){
      this.modal1=true;
      this.formItem.issue=this.$route.query.issue;
      this.formItem.source=this.$route.query.source;
      this.formItem.description=this.$route.query.description;
      this.formItem.reasonAnalyze=this.$route.query.reasonAnalyze;
      if(this.$route.query.location){
        this.formItem.location=this.$route.query.location;
      }
    }
  }
}

</script>

<style lang="less">
.tefectTracking {
  background: #fff;
  height: 100%;
  padding: 15px;
  font-size: 14px;
  .searchDiv {
    margin-bottom:15px;
    .marRight {
      margin-right: 15px;
    }
  }
  .ivu-form-item {
    margin-bottom: 15px;
  }
}
.baseTitle {
    font-weight: bold;
    font-size:16px;
    margin-bottom:10px;
  }
 .xzjz  {
   .ivu-form-item {
    margin-bottom: 10px;
  }
 }

</style>
